import React, { useRef } from 'react';
import './index.css';


function App() {
  const videoRefs = Array(9).fill(0).map(() => useRef(null));
  const buttonNames = ['Home', 'About', 'Contact', 'Help'];

  return (
    <div>

<div className="grid">
      {videoRefs.map((videoRef, index) => (
        <video key={index} ref={videoRef} controls></video>
      ))}
    </div>
    <div className="button-bar">
      {buttonNames.map((name, index) => (
        <button key={index} className="button">{name}</button>
      ))}
    </div>
    </div>
    
  );
}

export default App;